import { defineConfig, loadEnv, ConfigEnv } from 'vite';
import { resolve } from 'path';
import Components from 'unplugin-vue-components/vite';
import { VantResolver } from 'unplugin-vue-components/resolvers';
import vue from '@vitejs/plugin-vue';
import postCssPxToRem from 'postcss-pxtorem';

export default defineConfig(({ command, mode }: ConfigEnv) => {
	const env = loadEnv(mode, process.cwd(), '');

	return {
		base: '/h5/',
		plugins: [
			vue(),
			Components({
				resolvers: [VantResolver()]
			})
		],
		resolve: {
			alias: {
				'@': resolve(__dirname, './src')
			}
		},
		css: {
			postcss: {
				plugins: [
					postCssPxToRem({
						rootValue: 37.5, // 1rem的大小
						propList: ['*'] // 需要转换的属性，这里选择全部都进行转换
					})
				]
			},
			preprocessorOptions: {
				scss: {
					additionalData: `@import "@/assets/css/common.scss";`
				}
			}
		},
		server: {
			host: '0.0.0.0',
			port: 5173,
			proxy: {
				'/Api': {
					target: 'http://ztcy.huimaibuy.com/public/home/',
					changeOrigin: true,
					rewrite: (path) => path.replace(/^\/Api/, '')
				}
			}
		},
		build: {
			outDir: resolve(__dirname, 'h5'),
			rollupOptions: {
				output: {
					chunkFileNames: 'static/js/[name]-[hash].js',
					entryFileNames: 'static/js/[name]-[hash].js',
					assetFileNames: 'static/[ext]/[name]-[hash].[ext]'
				}
			}
		}
	};
});
